﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/BackSite.Master" Inherits="System.Web.Mvc.ViewPage" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    管理井的信息 
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="tablePlaceHolder" runat="server">

</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="TitlePlaceHolder" runat="server">
    <div id="title" style="background-image: url('../../Content/images/toolbar_bg.gif'); background-repeat: repeat-x">
        <span class="font16 fLeft" style="font-size: 26px; background-image: url('../../Content/img/toolbar_bg.gif'); background-repeat: repeat-x; width: 100%;"><strong>管理井的信息</strong></span>
    </div>
</asp:Content>

<asp:Content ID="Content4" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
        <script type="text/javascript">
            Ext.onReady(function () {

                Ext.define('MyData', {
                    extend: 'Ext.data.Model',
                    fields: [
                        //'active',
                            //第一个字段需要指定mapping，其他字段，可以省略掉。   
                             'Well_ID',
                             'Well_Type_ID',
                             'Dep_ID',
                             'Status'
                    ]
                });
                //创建数据源   
                var store = Ext.create('Ext.data.Store', {
                    model: 'MyData',
                    autoLoad: true,
                    pageSize: 16,
                    remoteFilter: true,
                    remoteSort: true,
                    proxy: {
                        //异步获取数据，这里的URL可以改为任何动态页面，只要返回JSON数据即可   
                        type: 'ajax',
                        //url: 'WellsQuery',
                        api: {
                            read: 'WellsQuery',
                            create: '../../Handlers/WellOperation.ashx?act=add',
                            destroy: '../../Handlers/WellOperation.ashx?act=del',
                            update: '../../Handlers/WellOperation.ashx?act=edit'
                        },
                        reader: {
                            type: 'json',
                            root: 'data',
                            totalProperty: 'total'
                        },
                        writer: {
                            type: "json",
                            encode: true,//encode和root是配套使用的，只有设置了root时，encode才起作用
                            root: "data",//设置root的好处就是可通过习惯的方式在后台提取数据
                            allowSingle: false//不然还得判断提交数据是数组还是对象
                        }
                    }
                });

                function button() {
                    return '<input type="button" value="编辑" />';
                }

                //创建Grid   
                var grid = Ext.create('Ext.grid.Panel', {
                    store: store,
                    selModel: { selType: "checkboxmodel", checkOnly: true, mode: "MULTI" }, plugins: [{
                        ptype: "cellediting",
                        listeners: {
                            edit: function (edit, e) {
                                if (e.field == "User_ID") {
                                    var regionStore = Ext.StoreManager.lookup("RegionStore");
                                    var rec = regionStore.getById(e.value);
                                    e.record.set("RegionDescription", rec.data.RegionDescription);
                                }
                            }
                        }
                    }],
                    columns: [
                            { xtype: 'rownumberer' },
                            //{ xtype: 'checkcolumn', text: '选择', dataIndex: 'active', checked: true, width: 100 },
                            { text: "井号", width: 100,flex:1, dataIndex: 'Well_ID', sortable: true },
                            { text: "井型号", width: 100, dataIndex: 'Well_Type_ID', sortable: true, field: { xtype: "combobox", store: ["CQJ", "CY_CYJJ", "CY_DQBJ", "CY_LGBJ", "CY_SLPSJ", "CY_ZPJ", "ZSJ"] } },
                            { text: "部门号", width: 100, dataIndex: 'Dep_ID', sortable: true, field: { xtype: "textfield", allowBlank: false } },
                            { text: "状态", width: 100, dataIndex: 'Status', sortable: true, field: { xtype: "combobox", store: ["有效", "注销"] } }
                            //,{ text: "操作", width: 100, dataIndex: 'Address', renderer: button }
                    ],
                    dockedItems: [{
                        xtype: 'toolbar',
                        height: '50px',
                        items: [
                            //{
                            //text: '反选',
                            //handler: function () {
                            //    // empty record
                            //    grid.getSelectionModel().selectAll();
                            //}
                            //}, '-',
                        {
                            text: "增加", id: "add", icon: '../../Content/images/add.gif', handler: function () {
                                var grid = this.up("gridpanel");
                                var edit = grid.plugins[0];
                                var rec = new MyData({
                                    Status: "有效"
                                });
                                edit.cancelEdit();
                                grid.store.insert(0, rec);
                                edit.startEditByPosition({ row: 0, column: 2 });
                            }
                        }, '-', {
                            itemId: 'delete',
                            text: '删除',
                            id: "delete",
                            icon: '../../Content/images/delete.gif',
                            disabled: true,
                            handler: function () {
                                var grid = this.up("gridpanel");
                                var rs = grid.getSelectionModel().getSelection();
                                if (rs.length > 0) {
                                    Ext.Msg.confirm('提示', '确认删除？', function (btn) {
                                        if (btn == "yes") {
                                            this.store.remove(this.getSelectionModel().getSelection());
                                            store.sync();
                                        }
                                    }, grid)
                                }
                            }
                        }, '-', {
                            itemId: 'save',
                            text: '保存',
                            id: "save",
                            icon: '../../Content/images/save.gif',
                            handler: function () {
                                store.sync();
                            }
                        }, '-', {
                            itemId: 'export',
                            text: '导出到Excel',
                            icon: '../../Content/images/application_go.png',
                            disabled: false,
                            handler: function () {
                                var selection = grid.getView().getSelectionModel().getSelection()[0];
                                if (selection) {
                                    store.remove(selection);
                                }
                            }
                        }, '-',
                        {
                            xtype: 'exporterbutton',
                            store: store,
                            //                            //以下两项配置已在Buttion.js中配置默认路径 不需要重复指定， 有需要者可自行修改
                            swfpath: 'downloadify.swf',
                            //downloadImage: 'download.png',
                            //
                            //                            //这里可以根据当前表格指定导出的文件名
                            downloadName: '井信息列表'
                        }]
                    }],
                    bbar: new Ext.PagingToolbar({
                        pageSize: 10,
                        store: store,
                        displayInfo: true,
                        displayMsg: '显示第{0}条到{1}条记录，一共{2}条',
                        emptyMsg: "没有记录"
                    }),
                    height: 490,
                    width:700,
                    x: 0,
                    y: 0,
                    title: '井信息列表',
                    renderTo: 'grid',
                    viewConfig: {
                        stripeRows: true
                    },
                    listeners: {
                    selectionchange: function (view, rs) {
                    Ext.getCmp("delete").setDisabled(rs.length == 0);
                }
            }
                })
                //创建Grid结束
                store.load({ params: { start: 0, limit: 10 } });

                function showDelMess() {
                    Ext.MessageBox.confirm('提示', '确认删除？', doDel);
                }

                function doDel(btn) {
                    if (btn == 'yes') {
                        var row = grid.getSelections();
                        var jsonData = "";
                        for (var i = 0, len = row.length; i < len; i++) {
                            var ss = row[i].get("ID");
                            jsonData = jsonData + ss + ",";
                        }
                        if (jsonData.length == 0) {
                            Ext.MessageBox.alert('提示', '删除失败！');
                        } else {
                            Ext.lib.Ajax.request(
                                        'GET',
                                        '../../Handlers/logMaster_Data.aspx?event=delete&delData=' + jsonData,
                                        {
                                            success: function (form, action) {
                                                Ext.MessageBox.alert('删除成功！');
                                                store.reload();
                                            },
                                            failure: function (form, action) {
                                                Ext.MessageBox.show({
                                                    title: '提示',
                                                    msg: '删除失败！',
                                                    buttons: Ext.Msg.OK,
                                                    icon: Ext.MessageBox.ERROR
                                                });
                                            }
                                        },
                                        null
                                    );
                        }
                    }
                }



            })
    </script>
    <div id="grid"></div>
</asp:Content>

<asp:Content ID="Content5" ContentPlaceHolderID="TableHeadPlaceHolder" runat="server">
</asp:Content>
